<template>
  <base-page-view class-name="packets-container">
    <view class="list_view">
      <view class="couponList">
        <view v-for="(item,index) in list" :key="index" class="couponItem">
          <view class="descripe">
            <view class="left">
              <view class="price">
                <span class="price_small unusePrice">¥</span>
                <span class="price_bold unusePrice">{{ item.price }}</span>
                <view v-if="item.reward_type === 4 && item.coupon_b_o" class="left_tit">{{ '满' + item.coupon_b_o.standardPrice + '元可用' }}</view>
                <view v-else class="left_tit">{{ item.title }}</view>
              </view>
              <view v-if="item.start_date" class="timeView">
                截止 {{ _formatDate(new Date(item.end_time * 1000), 'yyyy-MM-dd HH:mm:ss') }} 之前有效
              </view>
            </view>
            <view class="right">
              <view v-if="item.coupon_state !== 0" class="receive unuse">
                <span v-if="item.reward_type === 4">{{ item.coupon_state !== 0 ? (item.coupon_state === 1 ? '已使用' : '已过期') : '立即使用' }}</span>
                <span v-else>{{ item.get_status === 4 ? '已领取' : '立即领取' }}</span>
              </view>
            </view>
          </view>
          <view class="coupnStateBox">
            <span v-if="item.reward_type === 4 && item.coupon_b_o">{{ item.coupon_b_o.rule }}</span>
          </view>
        </view>
      </view>
      <view v-if="list.length<1" class="empty_view">
        <b-image src="/static/images/empty/empty_coupon.png" class="img" :is-asset="true" />
        <view class="tit">暂无失效奖励~</view>
        <view class="tit titC">明天来签到领奖励~</view>
      </view>
    </view>
  </base-page-view>
</template>
<script>
import { formatDate } from '@/utils/tools'
import './index.scss'
export default {
  components: {
  },
  data() {
    return {
      page_no: 1,
      list: [],
      nomore: false
    }
  },
  onLoad() {
    this.getList()
  },
  onPullDownRefresh() {
    this.page_no = 1
    this.list = []
    this.nomore = false
    this.getList()
  },
  onReachBottom() {
    if (this.nomore) return
    this.page_no += 1
    this.getList()
  },
  methods: {
    _formatDate(date, type) {
      return formatDate(date, type)
    },
    async getList() {
      const res = await this.$api.excellentApi.circleReward({
        activityid: 2,
        page_no: this.page_no,
        page_size: 10,
        state: 1 // 失效奖励1，未失效0
      })
      if (res.code === 0) {
        setTimeout(function() {
          uni.stopPullDownRefresh()
        }, 500)
        this.list = this.list.concat(res.data.rewards)
        if (res.data.rewards.length < 10) {
          this.nomore = true
        }
      }
    }
  }
}
</script>
